import { useReducer } from "react";

const initialText = '';
const reducer = (state, action) => action;
const TextInput = ({value, onChangeText}) => {
    return (
        <input type="text" value={value} onChange={e => onChangeText(e.target.value)} />
    )
};

function Demo () {
    const [firstName, changeFirstName] = useReducer(reducer,initialText);
    const [lastName, changeLastName] = useReducer(reducer, initialText);

    return (
        <div className="border">
            <p className="title">Demo--useReducer--3</p>
            <h2>firstName</h2>
            <TextInput type="text" value={firstName} onChangeText={changeFirstName} />
            <br />
            <h2>lastName</h2>
            <TextInput type="text" value={lastName} onChangeText={changeLastName} />
        </div>
    )
}

export default Demo;